<template>
	<div>
		<sports-swiper code="index" class="mt-1" />
		<div class="h-4"></div>
		<sports-league-hot />
		<sports-home-titles class="mt-4" :index="0"></sports-home-titles>
		<sports-match-list class="mt-2" is-league-hot :is-live="false" subscribe-type="popular" />
		<sports-home-titles class="mt-4" :index="1"></sports-home-titles>
		<sports-match-list class="mt-2" :is-live="false" subscribe-type="upcoming" />
		<sports-home-titles class="mt-4" :index="2"></sports-home-titles>
		<sports-league-list class="my-2" />
		<app-live-rank type="sports" :tabs="['sports', 'race']" />
	</div>
</template>
<script lang="ts" setup>
import { SportsSwiper } from '@/components/sports'
import SportsHomeTitles from './sports-home-titles.vue'
import { SportsLeagueHot, SportsMatchList, SportsLeagueList } from '@/components/sports'
import appLiveRank from '@/components/app/app-live-rank/index.vue'
</script>
